<template>
  <div class="plan-cont">
    <el-dialog :visible.sync="visible">
      <div class="panelWrap plan-main">
        <div class="title flex flexac flexjcsb fs14 cfff fwb pl p-r-20">
          <div>查询合同</div>
          <i class="el-icon-close" @click="handleCloseDialog" />
        </div>
        <div>
          <div>
            <div class="flex flexac m-t-20 m-l-15">
              <el-input v-model="contractNumber" class="co-input m-l-10" placeholder="请输入合同编号" @keyup.enter.native="getContractList" @input="handleSearch" />
              <el-button class="searchBtn co-btn flex flexac m-l-20 m-r-20" size="small" type="warning" @click="getContractList"><i class="co-i" /><span class="search1">查 询</span></el-button>
              <el-button class="defaultbtn co-btn saveBtn m-l-10 el-icon-success" @click="handleSelectSave">选 中</el-button>
            </div>
            <el-table
              ref="multipleTable"
              class="m-t-30 con-table m-b-20"
              type="expand"
              :data="dataList"
              highlight-current-row
              @select-all="handleCheck"
              @select="handleCheck"
              @selection-change="handleCheckChange"
              @row-dblclick="dbSelected"
            >
              <el-table-column type="selection" width="55" height="40" />
              <template v-for="item in tablehead">
                <el-table-column :key="item.index" align="center" :prop="item.prop" :label="item.label" />
              </template>
            </el-table>
          </div>
          <el-pagination
            class="paginationWrap co-page flex m-l-10"
            :current-page="paging.currentPage"
            :page-sizes="paging.pageSizeArr"
            :page-size="paging.pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="paging.total"
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
          />
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>

import { miContQueryList, miContDetail } from '@/api/maintenance/contract'
import { elevatorQueryList } from '@/api/elevator/elevator'
import { showNotice } from '@/utils/toolclass'

export default {
  name: 'PlanCont',
  props: {
    value: {
      type: Boolean
    },
    data: {
      type: Object,
      default: () => ({})
    }
  },
  data() {
    return {
      visible: false,
      paging: {
        currentPage: 1,
        pageSize: 5,
        pageSizeArr: [5, 4, 4, 4],
        total: 0
      },
      param: {
        bindState: '',
        id: '',
        registerCode: '',
        registerUnit: '',
        rescueCode: '',
        maintenanceUnitId: '',
        useUnitId: ''
      },
      contractNumber: '',
      userUnitName: '',
      dataList: [],
      eleList: [],
      eleRows: [],
      tablehead: [
        {
          index: 1,
          prop: 'contractNumbe',
          label: '合同编号',
          sortable: false,
          fixed: true,
          isShow: true
        }
      ]
    }
  },
  watch: {
    visible(v) {
      this.$emit('input', v)
    },
    value(v) {
      this.visible = v
    }
  },
  created() {
    this.getContractList()
    this.getElevatoList()
  },
  mounted() {},
  methods: {
    getContractList() {
      miContQueryList(this.contractNumber, this.paging.currentPage, this.paging.pageSize, this.userUnitName).then(res => {
        // console.log(res)
        if (res.code === '000000') {
          this.dataList = res.data
          this.paging = {
            currentPage: res.pager.pageIndex,
            pageSize: res.pager.pageSize,
            total: res.pager.totalSize
          }
        } else {
          // showNotice('error', '提示', res.msg)
        }
      })
    },
    getElevatoList() {
      elevatorQueryList(
        this.param.bindState,
        this.param.id,
        this.param.maintenanceUnitId,
        this.paging.currentPage,
        10000,
        this.param.registerCode,
        this.param.registerUnit,
        this.param.rescueCode,
        this.param.useUnitId).then(res => {
        // console.log(11, res)
        if (res.code === '000000') {
          this.eleList = res
        } else {
          // showNotice('error', '提示', res.msg)
        }
      })
    },
    // 单选操作，全选按钮失效操作
    handleCheck(selection, row) {
      this.$refs.multipleTable.clearSelection()
      if (selection.length === 0) { // 判断selection是否有值存在
        return
      }
      if (row) {
        this.selectioned = row
        this.row = row
        this.$refs.multipleTable.toggleRowSelection(row, true)
      }
    },

    // 取消单选的checkbox
    handleCheckChange(row) {
      if (row.length === 0) {
        this.selectioned = null
      }
    },
    dbSelected(row) {
      this.eleRows = []
      // console.log(this.eleList)
      miContDetail(row.id).then(res => {
        // console.log(res)
        res.data.elecatorList.map(item => {
          // console.log(item)
          this.eleList.data.filter(item1 => {
            if (item === item1.id) {
              return this.eleRows.push(item1)
            }
          })
        })
        // console.log(this.eleRows)
        this.$emit('update', row)
        this.$emit('updates', this.eleRows)
        // showNotice('success', '提示', '保存成功!')
        this.$emit('handleRefresh')
        this.$emit('handleCloseDialog')
      })
      this.coSelectVisible = false
    },
    handleSelectSave() {
      if (!this.selectioned) {
        showNotice('error', '提示', '请选择合同')
      } else {
        this.eleRows = []
        miContDetail(this.row.id).then(res => {
          res.data.elecatorList.map(item => {
            this.eleList.data.filter(item1 => {
              if (item === item1.id) {
                return this.eleRows.push(item1)
              }
            })
          })
          // console.log(this.eleRows)
          this.$emit('update', this.row)
          this.$emit('updates', this.eleRows)
          // showNotice('success', '提示', '保存成功!')
          this.$emit('handleRefresh')
          this.$emit('handleCloseDialog')
        })
        this.coSelectVisible = false
      }
    },
    handleSizeChange(val) {
      this.paging.pageSize = val
      this.getContractList()
    },
    handleCurrentChange(val) {
      this.paging.currentPage = val
      this.getContractList()
    },
    handleSearch() {
      if (this.contractNumber === '') {
        this.getContractList()
      }
    },
    handleCloseDialog() {
      this.visible = !this.visible
    }
  }
}
</script>

<style lang="scss">
@import '@/styles/public.scss';
.plan-cont {
  .plan-main {
    width: 800px;
    height: 500px;
    background: #ffffff;
    margin-left: -200px;
  }
}
</style>
